require( '$d/css/common.less' );
require( './style.less' );
define( [
  'require',
  'jquery',
  'message',
  'header',
  'api',
  'qiniu',
  'constants',
], function( require, $ ) {
  var message = require( 'message' );
  var api = require( 'api' );
  var content = $( '.main_left' );
  content.on( 'click', '.dropdown_toggle', function() {
    content.find( '.dropdown_menu' ).fadeIn();
  } );
  content.on( 'click', '.dropdown_menu > span', function() {
    content.find( '.dropdown_menu' ).fadeOut();
    content.find( '.filter_option' ).text( $( this ).text() );
  } );
  /**
   * 点击其他地方隐藏
   */
  $( document ).bind( 'click.problem_source', function( e ) {
    var e = e || window.event; //浏览器兼容性 
    var elem = e.target || e.srcElement;
    while ( elem ) { //循环判断至跟节点，防止点击的是div子元素 
      if ( elem.className && elem.className == 'problem_source' ) {
        return;
      }
      elem = elem.parentNode;
    }
    content.find( '.dropdown_menu' ).fadeOut();
  } );

  content.on( 'click', '.problem_l > li', function() {
    $( this ).addClass( 'green' ).siblings().removeClass( 'green' );
  } );

  // 图片上传
  var constants = require( 'constants' );

  var uploader = new QiniuJsSDK().uploader( {
    runtimes: 'html5,flash,html4',
    browse_button: 'upload_btn',
    uptoken_url: api.FILEUPLOAD.GET_IMG_UPTOKEN,
    get_new_uptoken: false,
    domain: constants.qiniuDomainImg,
    container: 'upload_btn_f',
    max_file_size: constants.imageMaxSize,
    flash_swf_url: 'path/of/plupload/Moxie.swf',
    max_retries: 0,
    dragdrop: true,
    drop_element: 'upload_btn_f',
    chunk_size: constants.imageMaxSize,
    auto_start: false,
    multi_selection: false,
    filters: {
      prevent_duplicates: true, //不允许选取重复文件
      mime_types: [ {
        title: "Image files",
        extensions: "jpg,jpeg,png,gif,bmp"
      } ]
    },
    init: {
      'FilesAdded': function( up, files ) {
        if ( uploader.files.length > 5 ) {
          message.showWarning( '只允许最多上传5张图片！', message.showTime );
          uploader.removeFile( files[ 0 ] );
          return;
        }

        plupload.each( files, function( file ) {
          preview( file.getNative() );
        } );
      },
      'Error': function( up, err, errTip ) {
        if ( err.code === -600 ) {
          message.showWarning( '文件大小超出' + constants.imageMaxSize, message.showTime );
        } else if ( err.code === -602 ) {
          message.showWarning( '不能选择重复的文件', message.showTime );
        } else {
          message.showWarning( '上传出现问题，请联系管理员', message.showTime );
        }
      }
    }
  } );

  var upload_files = [],
    successCount = 0;
  uploader.bind( 'FileUploaded', function( up, file, info ) {
    var img_info = typeof info.response === 'string' ? $.parseJSON( info.response ) : info.response;
    successCount++;
    upload_files.push( img_info.url.replace( /amp;/g, "" ) );
    if ( uploader.files && uploader.files.length === successCount ) {
      add_feedback( upload_files.join( ',' ) );
    }
  } );
  /*图片删除按钮*/
  content.on( 'click', '.action-remove', function() {
    var f = $( this ).parents( '.actions-holder' ).parent();
    uploader.removeFile( uploader.files[ f.index() ] );
    f.remove();
  } );

  /*提交按钮*/
  content.on( 'click', '.refer_sure', function() {
    if ( $( '.text_bx' ).val() == '' ) {
      message.showWarning( '请填写问题描述', message.showTime );
      $( '.text_bx' ).focus();
      return;
    }

    if ( $( '.upload_prevw li' ).length == 0 ) {
      add_feedback();
      return;
    }
    message.show('正在提交...');
    uploader.start();
  } )

  function add_feedback( imgs ) {
    var pg = $( '.filter_option' ).text();
    var ty = $( '.problem_l li.green span' ).text();
    var ts = $( '.text_bx' ).val();
    $.ajax( {
      type: 'post',
      url: 'feedback/add_feedback',
      data: {
        page: pg,
        question: ty,
        description: ts,
        imgs: imgs,
      },
      success: function( data ) {
        var data = typeof data === 'string' ? $.parseJSON( data ) : data;
        if ( data.ret == 0 ) {
          message.show( '已提交成功', message.showTime );
          $( '#feedback_modal' ).modal( 'show' );
        } else {
          message.showWarning( data.meg, message.showTime );
        }
      }
    } );
  }

  function preview( data ) {
    var reader = new FileReader();
    reader.readAsDataURL( data );

    reader.onload = function( event ) {
      $( '.upload_prevw' ).append( '<li><img src="' + this.result + '" alt="" /><div class="actions-holder"> <div class="action-backdrop"></div><span class="glyphicon glyphicon-remove action-remove"></span> </div></li>' );
    }
    reader.onerror = function( event ) {
      throw new Error( "读取出错" );
    }
  }

} )